app.views.NewListView = Ext.extend(Ext.form.FormPanel, {
	dockedItems: [{
		title: 'Create New List',
		xtype: 'toolbar',
		items: [
			
			{
				text : 'back',
				ui: 'back',
				iconMask: true,
				listeners: {
					'tap': function() {
						Ext.dispatch({
							controller: app.controllers.ListController,
							action: 'cancelCreate',
							animation: {type: 'slide', direction: 'right'}
						});
					}
				}
			},
			
			{xtype: 'spacer'},
			
			{
				text : 'create',
				iconMask: true,
				listeners: {
					'tap': function() {
						// Save new List
						var liName = app.views.NewListView.getValues().listName;
						
						// console.log('New list name: ' + liName);
						
						if (typeof liName  != 'undefined' && liName .length > 0) {
							var records = [];
						
							newList = Ext.ModelMgr.create({
									listName: liName
								}, 'app.models.CheckList');
						
							records.push(newList);
						
							//app.stores.checkLists.insert(0, records);
						
//							app.stores.checkLists.sync();

								
							var operation = new Ext.data.Operation({
								records: records
							});
								
							var theProxy = app.stores.checkLists.getProxy();
								
							theProxy.create(operation, null, null);

						
						}
						
						app.views.NewListView.reset();
						
						Ext.dispatch({
							controller: app.controllers.ListController,
							action: 'createEmptyList',
							animation: {type: 'slide', direction: 'right'}
						});
					}
				}
			}
		]
		
	}],
	
	submitOnAction: false,
	
	items: [
		{
			name: 'listName',
			label: 'Name',
			xtype: 'textfield'
		}
			
	]
		
	
});

